<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ include file="/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<%@ include file="/uilibs.jsp"%>
</head>
<body>
<div id="layout" class="mini-layout" style="width:100%;height:100%;"  borderStyle="border:solid 0px #aaa;">
    
    <div title="选择树" iconCls="icon-navigation" headerStyle="font-size:14px;font-weight:bold;color:#555;" region="west" width="160" expanded="true" showSplitIcon="true">
        <ul id="tree1" class="mini-tree" url="${ctx}/system/module/tree" style="width:100%;" showTreeIcon="true" textField="name" idField="id" expandOnNodeClick="true" onnodeselect="clickNode();" iconField="icon">
        </ul>
    </div>
    
<div title="模块信息" iconCls="icon-node" region="east" showSplit="true" showHeader="true" width="250" expanded="false" showSplitIcon="true">
    <div id="editPanel" class="mini-panel" style="width: 100%; height: 100%;" showToolbar="true" showHeader="false">
        <!-- 工具条处理开始 -->
        <div property="toolbar" class="mini-toolbar" style="padding: 0px; border: 0px; width: 100%;">
            <table style="width: 100%;">
                <tr>
                    <td style="width: 100%;">
                        <a id="saveBtn" name="saveBtn" class="mini-button" iconCls="icon-save" plain="true" onclick="save">保存</a>
                        <a id="cancelBtn" name="cancelBtn" class="mini-button" iconCls="icon-cancel" plain="true" onclick="cancel">取消</a>
                    </td>
                </tr>
            </table>
        </div>
        <!-- 工具条处理结束 -->
        <!-- 表单区域处理 开始 -->
        <div id="editForm" class="mini-fit" style="border:0px;padding:0px;">
            <input id="id" name="id" class="mini-hidden" value="${vo.id}"/>
            <table style="width:100%;">
                    <tr>
                        <td style="width:70px;">模块名称:</td>
                        <td>
                            <input name="name" id="name" style="width:150px;" required="true" class="mini-textbox" value="${vo.name}"/>
                        </td>
                    </tr>
                    <tr>
                        <td style="width:70px;">图标名称:</td>
                        <td>
                            <input name="icon" id="icon" style="width:150px;" class="mini-textbox" value="${vo.icon}"/>
                        </td>
                    </tr>
                    <tr>
                        <td style="width:70px;" valign="top">父节点:</td>
                        <td>
                        	<input id="pid" name="pid" class="mini-treeselect" style="width:150px;" url="${ctx}/system/module/list" textField="name" valueField="id" parentField="pid" value="${(empty vo)?'-1':vo.pid}"/>
                        </td>
                    </tr>
                    <tr>
                        <td style="width:70px;" valign="top">模块地址:</td>
                        <td>
                        	<input id="url" name="url" style="width:150px;" class="mini-textbox" value='${vo.url}' />
                        </td>
                    </tr>
                    <tr>
                        <td style="width:70px;" valign="top">排序编号:</td>
                        <td>
                        	<input id="sort_num" name="sort_num" class="mini-spinner" value="${vo.sort_num}" style="width:150px;"/>
                        </td>
                    </tr>
                    <tr>
                        <td style="width:70px;" valign="top">是否显示:</td>
                        <td>
                        <div id="show" name="show" class="mini-checkbox" checked="true" readOnly="false" text="是/否" value="${vo.show}"></div>
                        </td>
                    </tr>
                    <tr>
                        <td style="width:70px;" valign="top">描述:</td>
                        <td>
                        	<input id="describe" name="describe" class="mini-textarea" value='${vo.describe}' style="width: 150px;height:70px;"/>
                        </td>
                    </tr>
            </table>
        </div>
        <!-- 表单区域处理 结束 -->
    </div>
</div>
    
    <div title="center" region="center">
        <div class="mini-toolbar" style="border-bottom: 0; padding: 0px;">
            <table style="width: 100%;">
                <tr>
                    <td style="width: 100%;">
                        <a class="mini-button" iconCls="icon-add" onclick="add">增加</a> 
                        <a class="mini-button" iconCls="icon-edit" onclick="edit">编辑</a> 
                        <a class="mini-button" iconCls="icon-remove" onclick="remove">删除</a>
                        <span class="separator"></span>
                        <input class="mini-textbox" id="key" emptyText="模块名称" onenter="query()">
                        <a class="mini-button" iconCls="icon-find" onclick="query()">查询</a>
                    </td>
                </tr>
            </table>
        </div>
        <div class="mini-fit">
            <div id="grid" class="mini-datagrid" style="width:100%;height:100%;"
                url="${ctx}/system/common/grid" idField="id" multiSelect="true"
                showEmptyText="true" emptyText="暂无记录" sizeList="[5,10,20,50]" pageSize="20" onrowclick="rowclick" onrowdblclick="rowdblclick">
                <div property="columns">
                    <div type="checkcolumn" width="20"></div>
                    <div field="id" headerAlign="center" allowSort="true" width="40">节点ID</div>
                    <div field="name" headerAlign="center" allowSort="true">模块名称</div>
                    <div field="icon" headerAlign="center" allowSort="true">图标名称</div>
                    <div field="pid" headerAlign="center" allowSort="true" width="40">父节点ID</div>
                    <div field="url" headerAlign="center" allowSort="true">模块地址</div>
                    <div field="show" headerAlign="center" allowSort="true">是否显示</div>
                    <div field="sort_num" headerAlign="center" allowSort="true" width="40">排序编号</div>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
var grid = null;
var tree = null;
var form = null;

$(function(){
    mini.parse();
    form = new mini.Form("editForm");
    grid = mini.get("grid");
    var params={};
    params.sql="select * from system_module";
    grid.load(params);
    
    tree = mini.get("tree1");
});

function clickNode(){
    var node = tree.getSelectedNode();
    var params={};
    params.sql="select * from system_module where pid="+node.id;
    grid.load(params);
}

function query(){
    var v = mini.get("key").getValue();
    var params={};
    params.sql="select * from system_module where name like '%"+v+"%'";
    grid.load(params);
}

function add(){
    form.clear();
    mini.get("pid").setValue("-1");
    mini.get("layout").updateRegion("east", { expanded: true });
}

function edit() {
    var row = grid.getSelected();
    if (row && row.id) {
        mini.get("layout").updateRegion("east", { expanded: true });
        Dao.get("system_module",row.id,function(data){
            form.setData(data);
        });
    } else {
        mini.alert("请选中一条记录!");
    }
}

function remove() {
    var ids = "";
    var rows = grid.getSelecteds();
    if(rows && rows.length > 0){
        var arr = [];
        for(var i = 0, l = rows.length; i < l; i++){
            if(!rows[i].id)continue;
            arr.push(rows[i].id);
        }
        ids = arr.join(',');
    }
    if (ids && ids.length>0) {
        if (confirm("确定删除选中记录？")) {
            grid.loading("操作中，请稍后......");
            Dao.del("system_module",ids,function(data){
                if(data){
                    mini.get("layout").updateRegion("east", { expanded: false });
                    grid.reload();
                    tree.reload();
                } else {
                    mini.alert("服务器异常，请稍后重试!");
                }
            });
        }
    } else {
        mini.alert("请选中一条记录");
    }
}

function save() {
    form.validate();
    var vo = form.getData(true,false);
    if (form.isValid()) {
        Dao.saveOrUpdate("system_module",vo,function(data){
          if(data){
            mini.get("layout").updateRegion("east", { expanded: false });
            grid.reload();
          } else {
            mini.alert("服务器繁忙，请稍后重试");
          }
        });
    }
}

function rowclick(e){
    form.setData(e.record);
}

function rowdblclick(e){
    mini.get("layout").updateRegion("east", { expanded: true });
    Dao.get("system_module",e.record.id,function(data){
        form.setData(data);
    });
}

function cancel(){
    mini.get("layout").updateRegion("east", { expanded: false });
    form.clear();
}
</script>
</body>
</html>